import React, { Component } from "react";
import {
	View,
	Text,
	Image,
} from "react-native";
import { StackNavigator, NavigationActions } from "react-navigation";
import Icon from "react-native-vector-icons/FontAwesome";


import CustomTabBar from "../components/CustomTabBar";
import CategoryWeibo from "./CategoryWeibo";
import NewsDetails from "./NewsDetails";

const HomeStack = StackNavigator({
	Home: {
		screen: CustomTabBar,
		navigationOptions: ({navigation}) => {
			return {
				headerTitle: "My Discoveries",
				drawerLabel: "首页",
				drawerIcon: ({ tintColor }) => (
					<Image 
						source={require('../images/sidemenu_icon_world.png')}
						style={{ width: 22, height: 22, }}
					/>
				),
				headerLeft: (
					<Icon name="navicon" size={22} color={gColor.fontColorFive} style={{marginLeft: 10,}} onPress={() =>navigation.navigate("DrawerToggle")} />
				),
				headerRight: (
					<Icon name="globe" size={22} color={gColor.fontColorFive} style={{marginRight: 10,}} />
				),
				headerStyle: {
					backgroundColor: gColor.bgColorOne,
				},
				headerTitleStyle: {
					alignSelf: "center",
				},
			}
		},
	},
	CategoryWeibo: {
		screen: CategoryWeibo,
	},
	NewsDetails: {
		screen: NewsDetails,
	}
},{
	navigationOptions: {
		headerTintColor: gColor.fontColorFive,
		headerStyle: {
			backgroundColor: gColor.bgColorOne,
		}
	}
})

export default HomeStack;